<?php

use common\helpers\Html;
use common\helpers\Url;
use yii\grid\GridView;

/* @var $this yii\web\View */
/* @var $dataProvider yii\data\ActiveDataProvider */

$this->title = '任务列表';
$this->params['breadcrumbs'][] = $this->title;
?>
<style>
    .eis-horizontal-steps .eis-form-steps {
        overflow: hidden;
        padding: 0;
        font-size: 0;
        position: relative
    }

    .eis-horizontal-steps .eis-form-steps .eis-form-step {
        display: inline-block;
        vertical-align: middle;
        width: 14.28571%;
        text-align: center
    }
    .eis-horizontal-steps .eis-form-steps .eis-form-step:first-child{
        margin-left: 4%;
    }

    .eis-horizontal-steps .eis-form-steps .eis-form-step:last-child .eis-step-line{
        display: none !important;
    }

    .eis-horizontal-steps .eis-form-steps .eis-step-progress {
        height: 2px;
        background: rgb(243, 156, 18);
        margin-left: 4%;
        position: absolute;
        top: 15px;
        left: 15px;
    }

    .eis-horizontal-steps .eis-form-steps .eis-step-head {
        width: 100%;
        position: relative
    }

    .eis-step-head .eis-step-icon {
        width: 30px;
        height: 30px;
        font-size: 16px;
        border-radius: 50%;
        position: relative;
        z-index: 1;
    }

    .is-finish .eis-step-icon {
        border: 1px solid rgb(243, 156, 18)
    }

    .eis-step-head .eis-step-icon .step-icon-txt {
        width: 26px;
        height: 26px;
        background: #ddd;
        border: 1px solid #ddd;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
        text-align: center;
        line-height: 26px;
        color: #fff;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto
    }

    .is-finish .eis-step-icon .step-icon-txt {
        background: rgb(243, 156, 18);
        border: 1px solid rgb(243, 156, 18);
    }

    .eis-horizontal-steps .eis-step-head .eis-step-line {
        position: absolute;
        background-color: #f1f1f1;
        height: 2px;
        top: 15px;
        left: 28px;
        right: -4px
    }

    .eis-horizontal-steps .eis-form-step .eis-step-main {
        font-size: 14px;
        padding: 6px 0 0;
        color: #666;
        text-align: left
    }

    .is-finish .eis-step-main {
        color: #3197fd
    }
</style>
<div class="row">
    <div class="col-xs-12">
        <div class="box">
            <div class="box-header">
                <h3 class="box-title"><?= Html::encode($this->title) ?></h3>
                <div class="box-tools">
                    <?= Html::create(['edit']) ?>
                </div>
            </div>
            <div class="box-body table-responsive">
                <?= GridView::widget([
                    'dataProvider' => $dataProvider,
                    'tableOptions' => ['class' => 'table table-hover rf-table',],
                    'columns' => [
                        [
                            'class' => 'yii\grid\SerialColumn',
                            'visible' => false,
                        ],

                        //'id',

                        //'task_id',
                        'task_title',
                        [
                            'attribute' => 'task_level',
                            'label' => '任务等级',
                            'format' => 'raw',
                            'headerOptions' => ['class' => 'col-md-1'],
                            'value' => function ($model, $key, $index, $column) {
                                $level = '';
                                switch ($model['task_level']) {
                                    case 1:
                                        return '<span class="label label-primary">普通</span>';
                                    case 2:
                                        return '<span class="label label-success">优先</span>';
                                        break;
                                    case 3:
                                        return '<span class="label label-warning">加急</span>';
                                }
                            },
                        ],
                        'one_department',
                        'two_department',
                        [
                            'attribute' => 'task_status',
                            'label' => '任务进度',
                            'format' => 'raw',
                            'headerOptions' => ['class' => 'col-md-3'],
                            'value' => function ($model, $key, $index, $column) {
                                $array = ['上传','待审核','已审核','病毒检测','网间交互','病毒检测','完成'];
                                $step = '<div class="step-div"><div class="eis-horizontal-steps">
                                            <div class="eis-form-steps">';
                                for($i=1;$i<8;$i++){
                                    $is_finish = '';
                                    if($i<=$model['task_status']){
                                        $is_finish = 'is-finish';
                                    }
                                    $line = '';
                                    if($i<7) $line = "<div class='eis-step-line'></div>";
                                    $text = '';
                                    if($i == $model['task_status']) $text = "style='color:rgb(243, 156, 18);font-weight:800;'";
                                    $str = "
                                        <div class='eis-form-step {$is_finish}'>
                                            <div class='eis-step-head'>
                                                <div class='eis-step-icon'>
                                                    <div class='step-icon-txt'>{$i}</div>
                                                </div>
                                                {$line}
                                            </div>
                                            <div class='eis-step-main' {$text}>{$array[$i-1]}</div>
                                        </div>
                                    ";
                                    $step = $step.$str;
                                }
                                $step =$step.'
                                            <div class="eis-step-progress" style="width: '.$model['task_status']*14.28571.'%"></div>
                                            </div>
                                        </div>
                                    </div>
                                ';
                                return $step;
                            },
                        ],
                        //'file_nums',
                        //'file_sizes',
                        //'ftp',
                        //'task_status',
                        //'user_id',
                        //'check_user_id',
                        //'create_at',
                        //'check_time:datetime',
                        //'over_time:datetime',
                        //'client_type',
                        //'client_ip',
                        //'dest_net_name',
                        //'createTaskXML',
                        //'status',
                        //'created_at',
                        //'updated_at',
//            [
//                'class' => 'yii\grid\ActionColumn',
//                'header' => '操作',
//                'template' => '{edit} {status} {delete}',
//                'buttons' => [
//                'edit' => function($url, $model, $key){
//                        return Html::edit(['edit', 'id' => $model->id]);
//                },
//               'status' => function($url, $model, $key){
//                        return Html::status($model['status']);
//                  },
//                'delete' => function($url, $model, $key){
//                        return Html::delete(['delete', 'id' => $model->id]);
//                },
//                ]
//            ]
                    ]
                ]); ?>
            </div>
        </div>
    </div>
</div>
